<div class="com-reset-loginpassword-dialog">
    <modal :show="true">
        <validator :rules="rules" :parent="_self">
            <form class="m-form-dialog" :class="{'m-form-dialog--google':googleStatus === 'ON'}" name="form" action="javascript:;">
                <div class="modal-header">
                    <a href="javascript:;" class="close" @click="hide"><span>×</span></a>
                    <span class="modal-title">{{ $t('basic.securitySetting.modifyLogPwd') }}</span>
                </div>
                <div class="modal-body">
                    <div class="col-row">
                        <div class="col-label">
                            <label>{{ $t('common.currentPwd') }}</label>
                        </div>
                        <div class="col-input">
                            <input type="password"
                                   class="fn-block"
                                   :placeholder="$t('common.currentPassRequireTip')"
                                   autocomplete="off"
                                   id="currentPwd"
                                   name="currentPwd"
                                   v-model="form.currentPwd">
                            <div class="ui-tip"></div>
                        </div>
                    </div>
                    <div class="col-row">
                        <div class="col-label">
                            <label>{{ $t('common.newPwd') }}</label>
                        </div>
                        <div class="col-input">
                            <input
                                    type="password"
                                    class="fn-block"
                                    :placeholder="$t('common.newPassRequireTip')"
                                    autocomplete="off"
                                    id="newPwd"
                                    name="newPwd"
                                    @focus="focusTips"
                                    @blur="blurTips"
                                    v-model="form.newPwd">
                            <div class="ui-tip"></div>
                        </div>
                    </div>
                    <div class="col-row">
                        <div class="col-label">
                            <label>{{ $t('common.confirmPwd') }}</label>
                        </div>
                        <div class="col-input">
                            <input type="password"
                                   class="fn-block"
                                   :placeholder="$t('common.confirmPassRequireTip')"
                                   autocomplete="off"
                                   id="confirmNewPwd"
                                   name="confirmNewPwd"
                                   v-model="form.confirmNewPwd">
                            <div class="ui-tip"></div>
                        </div>
                    </div>

                    <div class="col-row" v-if="googleStatus === 'ON'">
                        <div class="col-label">
                            <label for="googleCode">{{ $t('common.pGoogleCode') }}</label>
                        </div>
                        <div class="col-input">
                            <input type="text"
                                   class="fn-block"
                                   autocomplete="off"
                                   id="googleCode"
                                   name="googleCode"
                                   maxlength="6"
                                   :placeholder="$t('common.pGoogleCode')"
                                   v-model="form.googleCode">
                            <div class="ui-tip"></div>
                        </div>
                    </div>
                </div>




                <div class="modal-footer">
                    <div class="col-row">
                        <div class="col-label">
                            <label>&nbsp;</label>
                        </div>
                        <div class="col-text">
                            <div class="btn-group">
                                <button type="submit"
                                        class="ui-btn"
                                        v-if="isRequesting===false"
                                        @click="submit">{{ $t('common.confirm') }}</button>
                                <button type="submit"
                                        class="ui-btn"
                                        disabled
                                        v-else="isRequesting===true">{{ $t('common.waiting') }}...</button>
                                <a href="javascript:;" @click="hide" class="btn-cancel">{{ $t('common.cancel') }}</a>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </validator>
    </modal>
</div>